import React from 'react'
import { Input, Space ,Button,Row, Col} from 'antd';
import { AudioOutlined } from '@ant-design/icons';
import { useDispatch,  } from 'react-redux'



export default function SearchServeType({SetLoading}) {
const dispatch = useDispatch()

    const { Search } = Input;

    const suffix = (
      <AudioOutlined
        style={{
          fontSize: 16,
          color: '#1890ff',
        }}
      />
    );
    
    const onSearch = value => {
      console.log(value);
      SetLoading(true)
      dispatch({
        type:"searchServeType",
        payload:{
          name : value
        }
      })

    };
    const myRef = React.createRef();
    const clear = () => {
      myRef.current.setValue("");
      SetLoading(true)
      dispatch({
        type:"searchServeType",
        payload:{
          name : ""
        }
      })
    }
    return (
        <div style={{marginBottom:"20px"}}>
             <Row>
      <Col span={12}>
      <Search
      placeholder="搜索服务类型"
      allowClear
      enterButton={["查询"]}
      size="middle"
      onSearch={onSearch}
      ref={myRef}
    />
      </Col>
      <Col span={12}><Button onClick={clear}>重置</Button></Col>
    </Row>
            
    
        </div>
    )
}
